<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        list-style: none;
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        text-decoration: none;
      }
      .box {
        padding: 10px;
      }
      .content {
        min-height: 400px;
      }
      .userNum {
        text-align: right;
        margin-bottom: 6px;
      }
      .usersBox {
        padding: 10px;
      }
      /* 单个用户框 */
      .users {
        border-bottom: 1px solid gray;
      }
      .user {
        width: 100%;
        height: 40px;
        border: 1px solid gray;
        border-bottom: none;
      }

      .userinfo {
        display: flex;
      }
      .userinfo li {
        height: 40px;
        text-align: center;
        line-height: 40px;
      }
      .userinfo li:nth-child(1) {
        width: 250px;
      }
      .userinfo li:nth-child(2) {
        width: 500px;
      }
      .userinfo li:nth-child(3) {
        width: 300px;
      }
      .userinfo li:nth-child(4) {
        width: 200px;
      }
      .userone li:nth-child(4) {
        background-color: lightblue;
        cursor: pointer;
      }
      .userhead {
        background-color: rgb(68, 47, 47);
        color: white;
        font-weight: 600;
      }
      .userone li:hover {
        background-color: lightblue;
      }
      .userone li:nth-child(4):hover {
        background-color: orange;
        cursor: pointer;
      }
      /* 提示信息的css */
      .ding {
        width: 200px;
        min-height: 100px;
        position: fixed;
        margin: 0 auto;
        margin-top: 100px;
        border-radius: 5px;
        border: 1px solid lightblue;
        background-color: white;
        color: rgb(160, 180, 189);
        line-height: 100px;
        font-weight: 600;
        display: none;
        text-align: center;
        z-index: 99;
      }
    </style>
    <link rel="stylesheet" href="http://localhost:3000/public/css/pagebtn.css">
  </head>
  <body>
    <div class="ding">这里是提示信息！</div>
    <div class="box">
      <div class="content">
        <div class="usersBox">
          <p class="userNum">
            <span class="">全部用户(除管理员):</span
            ><span class="num">未知</span><span>人</span>
          </p>
          <ul class="users">
            <li class="user userhead">
              <ul class="userinfo">
                <li>用户名</li>
                <li>邮箱</li>
                <li>密码</li>
                <li>功能</li>
              </ul>
            </li>
            <li class="user userone">
              <ul class="userinfo">
                <li>用户名</li>
                <li>邮箱</li>
                <li>密码</li>
                <li>删除</li>
              </ul>
            </li>
          </ul>
          <!-- 这里是分页按钮 -->
        <div class="pageBox" style="margin-top: 20px;">
                <div class="pageBtns">
                    <ul class="btns">
                        <li class="btn last" onclick="lastpage()">
                            <img src="http://localhost:3000/public/img/right.png" alt="">
                        </li>
                        <li class="btn btnpage choicePageBtn">1</li>
                        <li class="btn btnpage">2</li>
                        <li class="btn btnpage">3</li>
                        <li class="btn pageother">...</li>
                        <li class="btn next" onclick="nextpage()">
                            <img src="http://localhost:3000/public/img/right.png" alt="">
                        </li>
                    </ul>
                </div>
        </div>
        </div>
      </div>
    </div>
    <script src="http://localhost:3000/public/js/jquery.js"></script>
    <script src="http://localhost:3000/public/js/admin/adUser.js"></script>
  </body>
</html>
